<template>
    <div :class="horizontal?'page-main tips-main':'page-main tips-main horizontal'">
        <div class="top">
            <img :src="topBanner" alt="">
        </div>
        <div class="main-box">
            <div class="tit">温馨提示</div>
            <div class="content">
                <!-- <span> 本公益平台由上海市民政局与上海图书馆（上海科学技术情报研究所）合作建设，旨在传承中华优秀文化、弘扬社会主义核心价值观、促进新时代婚姻家庭和谐稳定。</span><br/>
                <span>2. 使用本平台属于自愿行为，输入的个人、情侣或家庭（夫妻）等信息的真实性由本人负责。</span><br/>
                <span>3. 本平台展示的内容仅供参考。</span> -->
                <span>1. 本项目为上海市民政局与上海图书馆（上海科学技术情报研究所）合作建设的传承婚姻家庭文化、弘扬社会主义核心价值观的公益服务平台。</span><br/>
                <span>2. 访问者应用该平台纯属自愿。在应用该平台过程中，需访问者输入信息的，该信息的真实性由输入者本人负责。</span><br/>
                <span>3. 本平台展示的内容包括但不限于图片、文字等，仅供参考。</span>
            </div>
            <a href="javascript:" class="agree" @click="agree">知晓并同意</a>
        </div>
        <div class="logo"></div>
    </div>
</template>

<script>
    export default {
        data(){
            return{
                topBanner:require('./../../assets/img/tips_top.jpg'),
                horizontal:false
            }
        },
        mounted() {
            this.init()
            window.onresize = ()=>{
                this.init()
                const deviceWidth = document.documentElement.clientWidth
                document.documentElement.style.fontSize = deviceWidth / 15.63 + 'px';
            }
        },
        methods:{
            agree(){
                // window.localStorage.setItem('agreeRules','1')
                this.$router.push('/home')
            },
            init(){
                const fw = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
                const fh = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
                this.horizontal = fw<fh
            }
        }
    }
</script>
